{% extends 'home/template.html' %}

{% load i18n %}
{% load martortags %}
{% load bleach_tags %}

{% block title %} {% translate "Report Details" %} {% endblock title %}

{% block stylesheets %}
  {{ block.super }}
{% endblock stylesheets %}

{% block content %}
  

    <section class="content-header">
      <div class="container-fluid">
        <div class="row mb-2">

          <div class="col-sm-6">
            <h4>{{ DB_report_query.title | bleach}} - {{ DB_report_query.report_id | bleach}}</h4>
          </div>
          <div class="col-sm-6">
            <ol class="breadcrumb float-sm-right">
              <li class="breadcrumb-item"><a href="/">{% translate "Home" %}</a></li>
              <li class="breadcrumb-item"><a href="{% url 'customer_view' DB_report_query.product.customer.pk %}">{{ DB_report_query.product.customer.name | bleach}}</a></li>
              <li class="breadcrumb-item"><a href="{% url 'product_view' DB_report_query.product.pk %}">{{ DB_report_query.product.name | bleach}}</a></li>
              <li class="breadcrumb-item active">{{ DB_report_query.title | bleach}}</li>
            </ol>
          </div>
        </div>


         <br>

        <div class="row">
            <div class="col-md-5">
              <a href="/report/findings/{{ DB_report_query.pk }}"><button type="button" class="btn btn-danger"><i class="fa fa-bug"></i> {% translate "Findings" %}</button></a>
              <a href="/report/appendix/{{ DB_report_query.pk }}"><button type="button" class="btn btn-success"><i class="fa fa-folder"></i> {% translate "Appendix" %}</button></a>
              <a href="/report/attackflow/{{ DB_report_query.pk }}"><button type="button" class="btn btn-warning"><i class="fa fa-sitemap"></i> {% translate "Attack Flows" %}</button></a>

            </div>



            <div class="col-md-7 text-right">

              <div class="btn-group">
                <button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown" aria-expanded="false"><i class="fa fa-download"></i> {% translate "Markdown" %}</button>

                  {% if 'markdown' in templates_directories %}
                    <div class="dropdown-menu" style="">
                      {% for template in templates_directories.markdown %}
                        <button class="dropdown-item" onclick="SaveSummaryImage('Markdown', '{{template}}');">Template > {{ template }}</button>
                      {% endfor %}
                    </div>
                  {% endif %}
              </div>

              <div class="btn-group">
                <button type="button" class="btn btn-warning dropdown-toggle" data-toggle="dropdown" aria-expanded="false"><i class="fa fa-download"></i> {% translate "PDF" %}</button>

                  {% if 'pdf' in templates_directories %}
                    <div class="dropdown-menu" style="">
                      {% for template in templates_directories.pdf %}
                        <button class="dropdown-item" onclick="SaveSummaryImage('PDF', '{{template}}');">Template > {{ template }}</button>
                      {% endfor %}
                    </div>
                  {% endif %}
              </div>

              <div class="btn-group">
                <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown" aria-expanded="false"><i class="fa fa-download"></i> {% translate "HTML" %}</button>

                  {% if 'html' in templates_directories %}
                    <div class="dropdown-menu" style="">
                      {% for template in templates_directories.html %}
                        <a href="/report/download/html/{{template}}/{{ DB_report_query.pk }}"><button class="dropdown-item">Template > {{ template }}</button></a>
                      {% endfor %}
                    </div>
                  {% endif %}
              </div>

              <div class="btn-group">
                <button type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown" aria-expanded="false"><i class="fa fa-download"></i> {% translate "Jupyter" %}</button>

                  {% if 'jupyter' in templates_directories %}
                    <div class="dropdown-menu" style="">
                      {% for template in templates_directories.jupyter %}
                        <a href="/report/download/jupyter/{{template}}/{{ DB_report_query.pk }}"><button class="dropdown-item">Template > {{ template }}</button></a>
                      {% endfor %}
                    </div>
                  {% endif %}
              </div>


              <a href="/findings/csv/{{ DB_report_query.pk }}"><button type="button" class="btn btn-success"><i class="fa fa-download"></i> {% translate "CSV" %}</button></a>

            </div>
        </div>

        <br>


      </div>
    </section>



    <section class="content">
      <div class="container-fluid">


      <div class="row">
        <div class="col-md-12">

            <div class="card card-outline card-success">
                <div class="card-header">
                  <h3 class="card-title">
                    <i class="far fa-chart-bar"></i>
                    <b>{% translate "Executive Summary" %}</b>
                  </h3>
                  <div class="card-tools">
                    <button type="button" class="btn btn-tool" data-card-widget="collapse" title="Collapse">
                      <i class="fas fa-minus"></i>
                    </button>
                  </div>

                </div>

                <div class="card-body">

                      <div class="row">

                        <div class="col-2 text-center">

                            {% if count_findings_critical > 0 %}
                              <input type="text" value="{{count_findings_critical}}" class="dial" data-min="0" data-max="{{count_findings_critical}}" data-fgColor="#cc0000" data-readOnly=true data-width="60%">
                            {% else %}
                              <input type="text" value="{{count_findings_critical}}" class="dial" data-min="0" data-max="{{count_findings_critical}}" data-fgColor="#D3D3D3" data-readOnly=true data-width="60%">
                            {% endif %}

                        <h3>{% translate "Critical" %}</h3>

                        </div>

                        <div class="col-2 text-center">

                            {% if count_findings_high > 0 %}
                              <input type="text" value="{{count_findings_high}}" class="dial" data-min="0" data-max="{{count_findings_high}}" data-fgColor="#f50000" data-readOnly=true data-width="60%">
                            {% else %}
                              <input type="text" value="{{count_findings_high}}" class="dial" data-min="0" data-max="{{count_findings_high}}" data-fgColor="#D3D3D3" data-readOnly=true data-width="60%">
                            {% endif %}

                        <h3>{% translate "High" %}</h3>
                        </div>


                        <div class="col-2 text-center">

                            {% if count_findings_medium > 0 %}
                              <input type="text" value="{{count_findings_medium}}" class="dial" data-min="0" data-max="{{count_findings_medium}}" data-fgColor="#fc7f03" data-readOnly=true data-width="60%">
                            {% else %}
                              <input type="text" value="{{count_findings_medium}}" class="dial" data-min="0" data-max="{{count_findings_medium}}" data-fgColor="#D3D3D3" data-readOnly=true data-width="60%">
                            {% endif %}

                        <h3>{% translate "Medium" %}</h3>
                        </div>

                        <div class="col-2 text-center">

                            {% if count_findings_low > 0 %}
                              <input type="text" value="{{count_findings_low}}" class="dial" data-min="0" data-max="{{count_findings_low}}" data-fgColor="#05b04f" data-readOnly=true data-width="60%">
                            {% else %}
                              <input type="text" value="{{count_findings_low}}" class="dial" data-min="0" data-max="{{count_findings_low}}" data-fgColor="#D3D3D3" data-readOnly=true data-width="60%">
                            {% endif %}

                        <h3>{% translate "Low" %}</h3>
                        </div>


                        <div class="col-2 text-center">

                            {% if count_findings_info > 0 %}
                              <input type="text" value="{{count_findings_info}}" class="dial" data-min="0" data-max="{{count_findings_info}}" data-fgColor="#45a7f7" data-readOnly=true data-width="60%">
                            {% else %}
                              <input type="text" value="{{count_findings_info}}" class="dial" data-min="0" data-max="{{count_findings_info}}" data-fgColor="#D3D3D3" data-readOnly=true data-width="60%">
                            {% endif %}

                        <h3>{% translate "Info" %}</h3>
                        </div>
                      
                        <div class="col-2 text-center">

                            {% if count_findings_none > 0 %}
                              <input type="text" value="{{count_findings_none}}" class="dial" data-min="0" data-max="{{count_findings_none}}" data-fgColor="#999999" data-readOnly=true data-width="60%">
                            {% else %}
                              <input type="text" value="{{count_findings_none}}" class="dial" data-min="0" data-max="{{count_findings_none}}" data-fgColor="#D3D3D3" data-readOnly=true data-width="60%">
                            {% endif %}

                        <h3>{% translate "None" %}</h3>
                        </div>


                      </div>

        
                  <hr>


                  <div class="row">
                    <div class="col-8 col-sm-3">
                      <div class="info-box bg-light">
                        <div class="info-box-content">
                          <span class="info-box-number text-center text-muted">{% translate "Creation date" %}</span>
                          <span class="info-box-text text-center text-muted mb-0">{{ DB_report_query.creation_date|date:"Y-m-d H:i:s" | safe | bleach}}</span>
                        </div>
                      </div>
                    </div>
                    <div class="col-8 col-sm-3">
                      <div class="info-box bg-light">
                        <div class="info-box-content">
                          <span class="info-box-number text-center text-muted">{% translate "Report date" %}</span>
                          <span class="info-box-text text-center text-muted mb-0">{{ DB_report_query.report_date|date:"d-m-Y" | safe | bleach}}</span>
                        </div>
                      </div>
                    </div>
                    <div class="col-8 col-sm-3">
                      <div class="info-box bg-light">
                        <div class="info-box-content">
                          <span class="info-box-number text-center text-muted">{% translate "Product" %}</span>
                          <span class="info-box-text text-center text-muted mb-0">{{ DB_report_query.product.name | safe | bleach}}<span>
                        </span></span></div>
                      </div>
                    </div>
                    <div class="col-8 col-sm-3">
                      <div class="info-box bg-light">
                        <div class="info-box-content">
                          <span class="info-box-number text-center text-muted">{% translate "Customer" %}</span>
                          <span class="info-box-text text-center text-muted mb-0">{{ DB_report_query.product.customer.name | safe | bleach}}<span>
                        </span></span></div>
                      </div>
                    </div>

                  </div>



                  <div class="row">
                    <div class="col-8 col-sm-3">
                      <div class="info-box bg-light">
                        <div class="info-box-content">
                          <span class="info-box-number text-center text-muted">{% translate "Report" %}</span>
                          <span class="info-box-text text-center text-muted mb-0">{{ DB_report_query.title | safe | bleach}}</span>
                        </div>
                      </div>
                    </div>
                    <div class="col-8 col-sm-3">
                      <div class="info-box bg-light">
                        <div class="info-box-content">
                          <span class="info-box-number text-center text-muted">{% translate "Findings" %}</span>
                          <span class="info-box-text text-center text-muted mb-0">{{ count_finding_query | safe | bleach}}</span>
                        </div>
                      </div>
                    </div>
                    <div class="col-8 col-sm-3">
                      <div class="info-box bg-light">
                        <div class="info-box-content">
                          <span class="info-box-number text-center text-muted">{% translate "Audit dates" %}</span>
                          <span class="info-box-text text-center text-muted mb-0">{{ DB_report_query.audit_start|date:"d-m-Y" | safe | bleach}} → {{ DB_report_query.audit_end|date:"d-m-Y" | safe | bleach}}<span>
                        </span></span></div>
                      </div>
                    </div>
                    <div class="col-8 col-sm-3">
                      <div class="info-box bg-light">
                        <div class="info-box-content">
                          <span class="info-box-number text-center text-muted">{% translate "Report ID" %}</span>
                          <span class="info-box-text text-center text-muted mb-0">{{ DB_report_query.report_id | safe | bleach}}<span>
                        </span></span></div>
                      </div>
                    </div>
                  </div>


                  {% if DB_report_query.executive_summary %}
                  <div class="row">
                    <div class="col-md-12">
                        <div class="card card-outline">
                          <div class="card-body">
                            {{ DB_report_query.executive_summary | safe_markdown | bleach}}
                          </div>
                        </div>
                    </div>
                  </div>
                  {% endif %}
                    

                </div>
              </div>

        </div>
      </div>




      <!-- ---------------------------------------- -->

      <div class="row">
        <div class="col-md-12">

            <div class="card card-outline card-success">
                <div class="card-header">
                  <h3 class="card-title">
                    <b>{% translate "Breakdown by Severity" %}</b>
                  </h3>
                  <div class="card-tools">
                    <button type="button" class="btn btn-tool" data-card-widget="collapse" title="Collapse">
                      <i class="fas fa-minus"></i>
                    </button>
                  </div>

                </div>
                <div class="card-body">
                    
                  <center>
                    <div id="SeveritybarChartEcharts" style="width:80%; height:500px;"></div>      
                  </center>

                </div>
              </div>

        </div>

      </div> 




      <div class="row">
        <div class="col-md-8">

            <div class="card card-outline card-success">
                <div class="card-header">
                  <h3 class="card-title">
                    <i class="fas fa-chart-bar"></i>
                    <b>{% translate "Breakdown by CWE Categories" %}</b>
                  </h3>
                  <div class="card-tools">
                    <button type="button" class="btn btn-tool" data-card-widget="collapse" title="Collapse">
                      <i class="fas fa-minus"></i>
                    </button>
                  </div>

                </div>
                <div class="card-body">
                
                  <center>
                    <div id="CWEPieChartEcharts" style="width:100%; min-width: 100%; height:400px;"></div>
                  </center>

                </div>
              </div>

        </div>


        <div class="col-md-4">

            <div class="card card-outline card-success">
                <div class="card-header">
                  <h3 class="card-title">
                    <i class="fas fa-chart-bar"></i>
                    <b>{% translate "Vulnerabilities by status" %}</b>
                  </h3>
                  <div class="card-tools">
                    <button type="button" class="btn btn-tool" data-card-widget="collapse" title="Collapse">
                      <i class="fas fa-minus"></i>
                    </button>
                  </div>

                </div>

                <div class="card-body">
                    <div id="StatusPieDoughnutEcharts" style="width:100%; height:400px;"></div>
                </div>

              </div>

        </div>




      </div> 

      <div class="row">
        <div class="col-md-8">

            <div class="card card-outline card-success">
                <div class="card-header">
                  <h3 class="card-title">
                    <i class="fas fa-chart-bar"></i>
                    <b>{% translate "Breakdown by OWASP Top Ten Application Security Risks" %}</b>
                  </h3>
                  <div class="card-tools">
                    <button type="button" class="btn btn-tool" data-card-widget="collapse" title="Collapse">
                      <i class="fas fa-minus"></i>
                    </button>
                  </div>

                </div>
                <div class="card-body">

                  <center>
                    <div id="OWASPPieChartEcharts" style="width:100%; height:400px;"></div>
                  </center>

                </div>
              </div>

        </div>


        <div class="col-md-4">

            <div class="card card-outline card-success">
                <div class="card-header">
                  <h3 class="card-title">
                    <i class="fas fa-chart-bar"></i>
                    <b>{% translate "Vulnerabilities by severity" %}</b>
                  </h3>
                  <div class="card-tools">
                    <button type="button" class="btn btn-tool" data-card-widget="collapse" title="Collapse">
                      <i class="fas fa-minus"></i>
                    </button>
                  </div>

                </div>

                <div class="card-body">
                    <div id="VulnPieDoughnutEcharts" style="width:100%; height:400px;"></div>
                </div>

              </div>

        </div>


      </div>

      <!-- ---------------------------------------- -->


      {% if DB_report_query.scope %}
      <div class="row">
        <div class="col-md-12">

            <div class="card card-outline card-success">
                <div class="card-header">
                  <h3 class="card-title">
                    <b>{% translate "Scope" %}</b>
                  </h3>
                  <div class="card-tools">
                    <button type="button" class="btn btn-tool" data-card-widget="collapse" title="Collapse">
                      <i class="fas fa-minus"></i>
                    </button>
                  </div>

                </div>
                <div class="card-body">

                  {{ DB_report_query.scope | safe_markdown | bleach}}

                </div>
              </div>

        </div>
      </div>
      {% endif %}


      {% if DB_report_query.outofscope %}
      <div class="row">
        <div class="col-md-12">

            <div class="card card-outline card-success">
                <div class="card-header">
                  <h3 class="card-title">
                    <b>{% translate "Out of Scope" %}</b>
                  </h3>
                  <div class="card-tools">
                    <button type="button" class="btn btn-tool" data-card-widget="collapse" title="Collapse">
                      <i class="fas fa-minus"></i>
                    </button>
                  </div>

                </div>
                <div class="card-body">

                  {{ DB_report_query.outofscope | safe_markdown | bleach}}

                </div>
              </div>

        </div>
      </div>
      {% endif %}


      {% if DB_report_query.methodology %}
      <div class="row">
        <div class="col-md-12">

            <div class="card card-outline card-success">
                <div class="card-header">
                  <h3 class="card-title">
                    <b>{% translate "Methodology" %}</b>
                  </h3>
                  <div class="card-tools">
                    <button type="button" class="btn btn-tool" data-card-widget="collapse" title="Collapse">
                      <i class="fas fa-minus"></i>
                    </button>
                  </div>

                </div>
                <div class="card-body">

                  {{ DB_report_query.methodology | safe_markdown | bleach}}

                </div>
              </div>

        </div>
      </div>
      {% endif %}



      {% if DB_report_query.recommendation %}
      <div class="row">
        <div class="col-md-12">

            <div class="card card-outline card-success">
                <div class="card-header">
                  <h3 class="card-title">
                    <b>{% translate "Recommendation" %}</b>
                  </h3>
                  <div class="card-tools">
                    <button type="button" class="btn btn-tool" data-card-widget="collapse" title="Collapse">
                      <i class="fas fa-minus"></i>
                    </button>
                  </div>

                </div>
                <div class="card-body">

                  {{ DB_report_query.recommendation | safe_markdown | bleach}}

                </div>
              </div>
        </div>
      </div>
      {% endif %}





      <div class="row">
        <div class="col-md-12">

            <div class="card card-outline card-danger">
                <div class="card-header">
                  <h3 class="card-title">
                    <b>{{ count_finding_query }} {% translate "Finding" %}{{ count_finding_query|pluralize:"" }}</b>
                  </h3>
                  <div class="card-tools">
                    <button type="button" class="btn btn-tool" data-card-widget="collapse" title="Collapse">
                      <i class="fas fa-minus"></i>
                    </button>
                  </div>

                </div>
                <div class="card-body">
                    
                     <div class="row">
                      <div class="col-md-12">

                      {% if count_finding_query == 0 %}

                        <a href="/finding/add/{{ DB_report_query.pk }}"><button type="button" class="btn btn-success btn-xm" data-toggle="modal">{% translate "Add Findings" %}</button></a>

                      {% else %}

                        <table id="findinglist" class="table table-bordered table-hover"> 

                        <thead>
                          <tr>
                            <th style="width: 40%">{% translate "Title" %}</th>
                            <th style="width: 5%">{% translate "Status" %}</th>
                            <th style="width: 5%">{% translate "Severity" %}</th>
                            <th style="width: 10%">{% translate "CVSS Score" %}</th>
                            <th style="width: 5%">{% translate "CWE" %}</th>
                            <th style="width: 5%">{% translate "OWASP" %}</th>
                            <th style="width: 30%"class="text-center">{% translate "Actions" %}</th>
                          </tr>
                        </thead>

                        <tbody>
                          {% for finding in DB_finding_query %}
                          <tr>
                                  <td>
                                      {{ finding.title | safe_markdown | bleach}}
                                  </td>
                                  <td>
                                    {{ finding.status | safe_markdown | bleach}}
                                  </td>
                                  <td>
                                                                      
                                        {% if finding.severity == "Critical" %}
                                            <b><font color="#CC0000">{{ finding.severity }}</font></b>
                                        {% elif finding.severity == "High" %}
                                            <b><font color="#F20000">{{ finding.severity }}</font></b>
                                        {% elif finding.severity == "Medium" %}
                                            <b><font color="#FC7F03">{{ finding.severity }}</font></b>
                                        {% elif finding.severity == "Low" %}
                                            <b><font color="#05B04F">{{ finding.severity }}</font></b>
                                        {% elif finding.severity == "Info" %}
                                            <b><font color="#45A7F7">{{ finding.severity }}</font></b>
                                        {% else %}
                                            <b>{{ finding.severity }}</b> ({% translate "will not appear in the report" %})
                                        {% endif %}

                                  </td>
                                  <td>
                                      {{ finding.cvss_score }}
                                  </td>
                                  <td>
                                      <a href="https://cwe.mitre.org/data/definitions/{{finding.cwe.cwe_id}}.html">{{ finding.cwe.cwe_id }}</a>
                                  </td>
                                  <td>
                                      <a href="{{ finding.owasp.owasp_url }}">{{ finding.owasp.owasp_full_id }}</a>
                                  </td>
                                  <td align="center">
                                      <a href="{% url 'finding_view' finding.pk %}"><button type="button" class="btn btn-primary btn-sm" data-toggle="modal" data-target=".bs-example-modal-sm"><i class="fa fa-folder"></i> {% translate "View" %}</button></a>

                                      {% if user.groups.all.0|stringformat:'s' == "administrator" %}
                                        <a href="{% url 'finding_edit' finding.pk %}"><button type="button" class="btn btn-info btn-sm" data-toggle="modal" data-target=".bs-example-modal-sm"><i class="fa fa-edit"></i> {% translate "Edit" %}</button></a>
                                        <button type="button" class="btn btn-warning btn-sm" data-toggle="modal" data-target=".mm-modal-clone-{{finding.pk}}"><i class="fas fa-copy"></i> {% translate "Clone" %} </button> 
                                        <button type="button" class="btn btn-danger btn-sm" data-toggle="modal" data-target=".mm-modal-{{finding.pk}}"><i class="fas fa-trash"></i> {% translate "Delete" %}</button>
                                      {% endif %}

                                  </td>

                          </tr>

                          <div class="modal modal-danger fade mm-modal-{{finding.pk}}" id="modal-danger">
                            <div class="modal-dialog">
                              <div class="modal-content bg-danger">
                                <div class="modal-header">
                                  <h4 class="modal-title">{% translate "Are you sure?" %}</h4>
                                  <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                    <span aria-hidden="true">&times;</span>
                                  </button>
                                </div>
                                <div class="modal-body">
                                  <p>{% translate "Delete Finding" %}&hellip;</p>
                                </div>
                                <div class="modal-footer justify-content-between">
                                  <button type="button" class="btn btn-outline-light" data-dismiss="modal">{% translate "Close" %}</button>
                                  <button type="button" onclick="DeleteID({{finding.pk}});" class="btn btn-outline-light">{% translate "Delete Finding" %}</button>
                                </div>
                              </div>
                            </div>
                          </div>


                          <div class="modal modal-warning fade mm-modal-clone-{{finding.pk}}" id="modal-warning">
                            <div class="modal-dialog">
                              <div class="modal-content bg-warning">
                                <div class="modal-header">
                                  <h4 class="modal-title">{% translate "Are you sure?" %}</h4>
                                  <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                    <span aria-hidden="true">&times;</span>
                                  </button>
                                </div>
                                <div class="modal-body">
                                  <p>{% translate "Clone Finding" %}&hellip;</p>
                                </div>
                                <div class="modal-footer justify-content-between">
                                  <button type="button" class="btn btn-outline-light" data-dismiss="modal">{% translate "Close" %}</button>
                                  <button type="button" onclick="CloneFinding({{finding.pk}});" class="btn btn-outline-light">{% translate "Clone Finding" %}</button>
                                </div>
                              </div>
                            </div>
                          </div>



                          {% endfor %}

                        </tbody>
                      </table>


                      {% endif %}
         
                      </div>

                    </div>

                </div>
              </div>

        </div>
      </div> 



      <div class="row">
        <div class="col-md-12">

            <div class="card card-outline card-danger">
                <div class="card-header">
                  <h3 class="card-title">
                    <b>{{ DB_appendix_query.count }} {% translate "Appendix" %}</b>
                  </h3>
                  <div class="card-tools">
                    <button type="button" class="btn btn-tool" data-card-widget="collapse" title="Collapse">
                      <i class="fas fa-minus"></i>
                    </button>
                  </div>

                </div>
                <!-- /.card-header -->
                <div class="card-body">
                    
                
                  <div class="row">
                    <div class="col-md-12">

                      {% if count_appendix_query == 0 %}

                        <a href="/appendix/add/{{ DB_report_query.pk }}"><button type="button" class="btn btn-success btn-xm">{% translate "Add Appendix" %}</button></a>

                      {% else %}

                      <table id="appendixlist" class="table table-bordered table-hover"> 

                        <thead>
                          <tr>
                            <th style="width: 35%">{% translate "Title" %}</th>
                            <th style="width: 40%">{% translate "Finding" %}</th>
                            <th style="width: 25%"class="text-center">{% translate "Actions" %}</th>
                          </tr>
                        </thead>


                        <tbody>
                          {% for appendix in DB_appendix_query %}
                          <tr>

                            <td>
                                {{appendix.title| safe_markdown | bleach}}
                            </td>

                            <td>
                                {% for finding in appendix.finding.all %}
                                  {{finding.title| safe_markdown | bleach}}
                                {% endfor %}
                            </td>
                            <td align="center">
                                <a href="/appendix/view/{{ appendix.pk }}"><button type="button" class="btn btn-primary btn-sm"><i class="fa fa-folder"></i> {% translate "View" %}</button></a>

                                {% if user.groups.all.0|stringformat:'s' == "administrator" %}
                                  <a href="/appendix/edit/{{ appendix.pk }}"><button type="button" class="btn btn-info btn-sm"><i class="fa fa-edit"></i> {% translate "Edit" %}</button></a> 
                                  <button type="button" class="btn btn-danger btn-sm" data-toggle="modal" data-target=".mm-appendix-modal-{{appendix.pk}}"><i class="fas fa-trash"></i> {% translate "Delete" %}</button>
                                {% endif %}
                                
                            </td>

                          </tr>

                          <div class="modal modal-danger fade mm-appendix-modal-{{appendix.pk}}" id="modal-danger">
                            <div class="modal-dialog">
                              <div class="modal-content bg-danger">
                                <div class="modal-header">
                                  <h4 class="modal-title">{% translate "Are you sure?" %}</h4>
                                  <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                    <span aria-hidden="true">&times;</span>
                                  </button>
                                </div>
                                <div class="modal-body">
                                  <p>{% translate "Delete appendix" %}&hellip;</p>
                                </div>
                                <div class="modal-footer justify-content-between">
                                  <button type="button" class="btn btn-outline-light" data-dismiss="modal">{% translate "Close" %}</button>
                                  <button type="button" onclick="DeleteID_A({{appendix.pk}});" class="btn btn-outline-light">{% translate "Delete Appendix" %}</button>
                                </div>
                              </div>
                            </div>
                          </div>


                          {% endfor %}

                        </tbody>
                      </table>

                    {% endif %}

       
                    </div>

                  </div>

                </div>
              </div>

        </div>
      </div>






      <div class="row">
        <div class="col-md-12">

            <div class="card card-outline card-danger">
                <div class="card-header">
                  <h3 class="card-title">
                    <b>{{ DB_attackflow_query.count }} {% translate "Attack Flows" %}</b>
                  </h3>
                  <div class="card-tools">
                    <button type="button" class="btn btn-tool" data-card-widget="collapse" title="Collapse">
                      <i class="fas fa-minus"></i>
                    </button>
                  </div>

                </div>
                <!-- /.card-header -->
                <div class="card-body">
                    
                
                  <div class="row">
                    <div class="col-md-12">

                      {% if count_attackflow_query == 0 %}

                        <a href="/attackflow/add/{{ DB_report_query.pk }}"><button type="button" class="btn btn-success btn-xm">{% translate "Add Attack Flow" %}</button></a>

                      {% else %}

                      <table id="attackt" class="table table-bordered table-hover"> 

                        <thead>
                          <tr>
                            <th style="width: 35%">{% translate "Title" %}</th>
                            <th style="width: 40%">{% translate "Finding" %}</th>
                            <th style="width: 25%" class="text-center">{% translate "Actions" %}</th>
                          </tr>
                        </thead>


                        <tbody>
                          {% for attackflow in DB_attackflow_query %}
                          <tr>

                            <td>
                                {{attackflow.title| safe_markdown | bleach}}
                            </td>


                            <td>
                                {% for finding in attackflow.finding.all %}
                                  {{finding.title| safe_markdown | bleach}}
                                {% endfor %}
                            </td>

                            <td align="center">
                                {% if user.groups.all.0|stringformat:'s' == "administrator" %}
                                  <a href="/attackflow/edit/{{ attackflow.pk }}"><button type="button" class="btn btn-info btn-sm"><i class="fa fa-edit"></i> {% translate "Edit" %}</button></a> 
                                  <button type="button" class="btn btn-danger btn-sm" data-toggle="modal" data-target=".mm-attackflow-modal-{{attackflow.pk}}"><i class="fas fa-trash"></i> {% translate "Delete" %}</button>
                                {% endif %}
                                
                            </td>

                          </tr>

                          <div class="modal modal-danger fade mm-attackflow-modal-{{attackflow.pk}}" id="modal-danger">
                            <div class="modal-dialog">
                              <div class="modal-content bg-danger">
                                <div class="modal-header">
                                  <h4 class="modal-title">{% translate "Are you sure?" %}</h4>
                                  <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                    <span aria-hidden="true">&times;</span>
                                  </button>
                                </div>
                                <div class="modal-body">
                                  <p>{% translate "Delete Attack Flow" %}&hellip;</p>
                                </div>
                                <div class="modal-footer justify-content-between">
                                  <button type="button" class="btn btn-outline-light" data-dismiss="modal">{% translate "Close" %}</button>
                                  <button type="button" onclick="DeleteID_AT({{attackflow.pk}});" class="btn btn-outline-light">{% translate "Delete Attack Flow" %}</button>

                                </div>
                              </div>
                            </div>
                          </div>


                          {% endfor %}

                        </tbody>
                      </table>

                    {% endif %}

       
                    </div>

                  </div>

                </div>
              </div>

        </div>
      </div>




<div class="row">
        <div class="col-md-12">

            <div class="card card-outline card-info">
                <div class="card-header">
                  <h3 class="card-title">
                    <b>{{ DB_deliverable_query.count }} {% translate "Reports generated - Deliverables" %} </b>
                  </h3>


                  <div class="card-tools">
                    <button type="button" class="btn btn-tool" data-card-widget="collapse" title="Collapse">
                      <i class="fas fa-minus"></i>
                    </button>
                  </div>

                </div>
                <!-- /.card-header -->
                <div class="card-body">


                  <div class="row">
                    <div class="col-md-12">

                      <table id="deliverablelist" class="table table-bordered table-hover">

                        <thead>
                          <tr>
                            <th style="width: 20%" class="text-center">{% translate "Date" %}</th>
                            <th style="width: 50%" class="text-center">{% translate "File" %}</th>
                            <th style="width: 10%" class="text-center">{% translate "Type" %}</th>
                            <th style="width: 20%" class="text-center">{% translate "Actions" %}</th>
                          </tr>
                        </thead>


                        <tbody>
                          {% for deliverable in DB_deliverable_query %}
                          <tr>
                            <td>{{ deliverable.generation_date|date:"Y-m-d H:i:s" }}</td>
                            <td><a href="{% url 'deliverable_download' deliverable.pk %}">{{ deliverable.filename }}</a></td>
                            <td>{{ deliverable.filetype }}/{{ deliverable.filetemplate }}</td>
                            <td class="text-center">
                              {% if user.groups.all.0|stringformat:'s' == "administrator" %}
                                <a href="{% url 'deliverable_download' deliverable.pk %}"><button type="button" class="btn btn-warning btn-sm"><i class="fa fa-download"></i> {% translate "Download" %}</button></a>

                                <button type="button" class="btn btn-danger btn-sm" data-toggle="modal" data-target=".mm-modal-del-deliverable-{{deliverable.pk}}"><i class="fas fa-trash"></i> {% translate "Delete" %} </button>
                              {% endif %}
                            </td>
                          </tr>

                          <div class="modal modal-danger fade mm-modal-del-deliverable-{{deliverable.pk}}" id="modal-danger">
                            <div class="modal-dialog">
                              <div class="modal-content bg-danger">
                                <div class="modal-header">
                                  <h4 class="modal-title">{% translate "Are you sure?" %}</h4>
                                  <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                    <span aria-hidden="true">&times;</span>
                                  </button>
                                </div>
                                <div class="modal-body">
                                  <p>{% translate "Delete Deliverable" %}&hellip;</p>
                                </div>
                                <div class="modal-footer justify-content-between">
                                  <button type="button" class="btn btn-outline-light" data-dismiss="modal">{% translate "Close" %}</button>
                                  <button type="button" onclick="DeleteID_D({{deliverable.pk}});" class="btn btn-outline-light">{% translate "Delete Deliverable" %}</button>
                                </div>
                              </div>
                            </div>
                          </div>


                          {% endfor %}

                        </tbody>
                      </table>
                    </div>

                  </div>

                </div>
              </div>

        </div>
      </div>





      </div>
    </section>





{% endblock content %}

{% block javascripts %}
  {{ block.super }}

<script>
    $(function() {
        $(".dial").knob();
    });
</script>

<script>
    $('.dial').trigger(
        'configure',
        {
            "min":0,
            "max":10,
            "fgColor":"#FF0000",
            "skin":"tron",
            "cursor":true
        }
    );
</script>


<script>
  $(function () {
    $("#findinglist").DataTable({
      "order": [[3, 'desc']],
      "paging": true,
      "searching": true,
      "responsive": true, 
      "lengthChange": false, 
      "autoWidth": false,
      "buttons": ["copy", "csv", "excel", "pdf", "print", "colvis"]
    }).buttons().container().appendTo('#findinglist_wrapper .col-md-6:eq(0)');
  });
</script>

<script>
  $(function () {
    $("#appendixlist").DataTable({
      "paging": true,
      "searching": true,
      "responsive": true, 
      "lengthChange": false, 
      "autoWidth": false,
      "buttons": ["copy", "csv", "excel", "pdf", "print", "colvis"]
    }).buttons().container().appendTo('#appendixlist_wrapper .col-md-6:eq(0)');
  });
</script>

<script>
  $(function () {
    $("#attackt").DataTable({
      "paging": true,
      "searching": true,
      "responsive": true, 
      "lengthChange": false, 
      "autoWidth": false,
      "buttons": ["copy", "csv", "excel", "pdf", "print", "colvis"]
    }).buttons().container().appendTo('#attackt_wrapper .col-md-6:eq(0)');
  });
</script>


<script>
  $(function () {
    $("#deliverablelist").DataTable({
      "order": [[1, 'desc']],
      "paging": true,
      "searching": true,
      "responsive": true, 
      "lengthChange": false, 
      "autoWidth": false,
      "buttons": ["copy", "csv", "excel", "pdf", "print", "colvis"]
    }).buttons().container().appendTo('#deliverablelist_wrapper .col-md-6:eq(0)');
  });
</script>


<script type="text/javascript">
        var chartSeveritybar = echarts.init(document.getElementById('SeveritybarChartEcharts'));

        var option = {
            title: {
            },
            tooltip: {},
            legend: {
                data:['Severity']
            },
            toolbox: {
              show: false,
              feature: {
                  saveAsImage: {
                    show: true,
                    title: "Save Image",
                    name: "Breakdown_by_Severity"
                  }
              }
            },
            xAxis: {
                type: 'category',
                data: [{
                  value: '{% translate "Critical" %}',
                  textStyle: {
                    fontSize:15
                  }
                 },{
                  value: '{% translate "High" %}',
                  textStyle: {
                    fontSize:15
                  }
                 }, {
                  value: '{% translate "Medium" %}',
                  textStyle: {
                    fontSize:15
                  }
                 } , {
                  value: '{% translate "Low" %}',
                  textStyle: {
                    fontSize:15
                  }
                 }, {
                  value: '{% translate "Info" %}',
                  textStyle: {
                    fontSize:15
                  }
                 }]
            },
            yAxis: {
              type: 'value',
              interval: 1,
              axisLabel:{
               fontSize: 12
              }
            },

            series: [{
                type: 'bar',
                label:{
                    show:true,
                    fontSize: 18,
                    position:'top',
                },
                stack: 1,
                animation: false,
            bars: {
                show: false,
                barWidth: 0.2,
                fill:10
            },

            data: [

                {
                    value: {{count_findings_critical}},
                    itemStyle: {color: '#cc0000'},
                },
                {
                    value: {{count_findings_high}},
                    itemStyle: {color: '#ff403d'},
                },
                {
                    value: {{count_findings_medium}},
                    itemStyle: {color: '#fc7f03'},
                },
                {
                    value: {{count_findings_low}},
                    itemStyle: {color: '#05b04f'},
                },
                {
                    value: {{count_findings_info}},
                    itemStyle: {color: '#45a7f7'},
                }
              ]
            }]
        };

        chartSeveritybar.setOption(option);

</script>




<script type="text/javascript">
    var chart_CWE = echarts.init(document.getElementById('CWEPieChartEcharts'));

    var option = {
            tooltip: {
                trigger: 'item',
                formatter: '{b} <br>{c}'
            },
            toolbox: {
              show: false,
              feature: {
                  saveAsImage: {
                    show: true,
                    title: "Save Image",
                    name: "Breakdown_by_Categories"
                  }
              }
            },
            series: [
                {
                    name: 'CWE',
                    type: 'pie',
                    radius: '70%',
                    animation: false,

                    data: {{cwe_categories|safe}},
                    labelLine: {
                        show: true
                    },
                    emphasis: {
                        itemStyle: {
                            shadowBlur: 10,
                            shadowOffsetX: 0,
                            shadowColor: 'rgba(0, 0, 0, 0.5)'
                        }
                    }
                }
            ]
    };

    chart_CWE.setOption(option);

</script>



<script type="text/javascript">
  var chart_OWASP = echarts.init(document.getElementById('OWASPPieChartEcharts'));

  var option_OWASP = {
          tooltip: {
              trigger: 'item',
              formatter: '{b} <br>{c}'
          },
          toolbox: {
            show: false,
            feature: {
                saveAsImage: {
                  show: true,
                  title: "Save Image",
                  name: "Breakdown_by_OWASP_Categories"
                }
            }
          },
          series: [
              {
                  name: 'OWASP',
                  type: 'pie',
                  radius: '70%',
                  animation: false,

                  data: {{owasp_categories|safe}},
                  labelLine: {
                      show: true
                  },
                  emphasis: {
                      itemStyle: {
                          shadowBlur: 10,
                          shadowOffsetX: 0,
                          shadowColor: 'rgba(0, 0, 0, 0.5)'
                      }
                  }
              }
          ]
  };

  chart_OWASP.setOption(option_OWASP);

</script>





<script>

  function SaveSummaryImage(doc_type, template) {

        var imgSeveritybar = new Image();
        imgSeveritybar.src = chartSeveritybar.getDataURL({
            pixelRatio: 2,
            backgroundColor: '#fff'
        });

        var imgCWE = new Image();
        imgCWE.src = chart_CWE.getDataURL({
            pixelRatio: 2,
            backgroundColor: '#fff'
        });

        var imgOWASP = new Image();
        imgOWASP.src = chart_OWASP.getDataURL({
            pixelRatio: 2,
            backgroundColor: '#fff'
        });

        $.ajax({
            type: 'POST',
            url: "/en/report/uploadsummaryfindings/" + {{ DB_report_query.pk }}, // prepend a language code or even better: use window.location.href
            headers:{
              "X-CSRFToken": '{{ csrf_token }}'
            },
            data : { 'fileSeveritybar': imgSeveritybar.src, 'file_cwe': imgCWE.src, 'file_owasp': imgOWASP.src },

            success : function(json) {
                //console.log("requested complete");
                if (json.status == 'success'){
                  if (doc_type == 'PDF'){
                    document.location.href = "/report/download/pdf/"+template+"/{{ DB_report_query.pk }}";
                    //window.open('/report/download/pdf/{{ DB_report_query.pk }}', '_blank');
                  }
                  else if (doc_type == 'Markdown'){
                    document.location.href = "/report/download/markdown/"+template+"/{{ DB_report_query.pk }}";
                    //window.open('/report/download/markdown/{{ DB_report_query.pk }}', '_blank');
                  }

                }
            }
        })

  }

</script>


<script type="text/javascript">
    var chart_Vuln = echarts.init(document.getElementById('VulnPieDoughnutEcharts'));

    var option = {
          tooltip: {
            trigger: 'item'
          },
          legend: {
            top: '5%',
            left: 'center'
          },
          series: [
            {
              name: '{% translate "Vulnerabilities" %}',
              type: 'pie',
              radius: ['40%', '70%'],
              avoidLabelOverlap: false,
              itemStyle: {
                borderRadius: 10,
                borderColor: '#fff',
                borderWidth: 2
              },
              label: {
                show: false,
                position: 'center'
              },
              emphasis: {
                label: {
                  show: false,
                  fontSize: 40,
                  fontWeight: 'bold'
                }
              },
              labelLine: {
                show: false
              },
              data: [
                { value: {{count_findings_critical}}, name: '{% translate "Critical" %}', itemStyle: {color: '#cc0000'} },
                { value: {{count_findings_high}}, name: '{% translate "High" %}', itemStyle: {color: '#ff403d'}  },
                { value: {{count_findings_medium}}, name: '{% translate "Medium" %}', itemStyle: {color: '#fc7f03'}  },
                { value: {{count_findings_low}}, name: '{% translate "Low" %}', itemStyle: {color: '#05b04f'}  },
                { value: {{count_findings_info}}, name: '{% translate "Info" %}', itemStyle: {color: '#45a7f7'}  }              ]
            }
          ]
        };

    chart_Vuln.setOption(option);

</script>

<script type="text/javascript">
    var chart_status = echarts.init(document.getElementById('StatusPieDoughnutEcharts'));

    var option = {
          tooltip: {
            trigger: 'item'
          },
          legend: {
            top: '5%',
            left: 'center'
          },
          series: [
            {
              name: '{% translate "Status" %}',
              type: 'pie',
              radius: ['40%', '70%'],
              avoidLabelOverlap: false,
              itemStyle: {
                borderRadius: 10,
                borderColor: '#fff',
                borderWidth: 2
              },
              label: {
                show: false,
                position: 'center'
              },
              emphasis: {
                label: {
                  show: false,
                  fontSize: 40,
                  fontWeight: 'bold'
                }
              },
              labelLine: {
                show: false
              },
              data: [
                { value: {{count_open_findings}}, name: '{% translate "Open" %}', itemStyle: {color: 'blue'} },
                { value: {{count_closed_findings}}, name: '{% translate "Closed" %}', itemStyle: {color: 'green'} }              ]
            }
          ]
        };

    chart_status.setOption(option);

</script>

<script>
  function DeleteID(del_id) {
        $.ajax({
            type: 'POST',
            url: "{% url 'finding_delete' %}",
            headers:{
              "X-CSRFToken": '{{ csrf_token }}'
            },
            data : { 'delete_id': del_id},

            success : function(json) {
              document.location.href = "/report/findings/{{DB_report_query.pk}}"; 
            }
        })
  }
</script>

<script>
  function DeleteID_A(del_id) {
        $.ajax({
            type: 'POST',
            url: "{% url 'appendix_delete' %}",
            headers:{
              "X-CSRFToken": '{{ csrf_token }}'
            },
            data : { 'delete_id': del_id},

            success : function(json) {
              document.location.href = "{% url 'report_view' DB_report_query.pk %}";
              document.location.reload(true);
            }
        })
  }
</script>


<script>
function DeleteID_D(del_id) {
  $.ajax({
      type: 'POST',
      url: "{% url 'deliverable_delete' %}",
      headers:{
        "X-CSRFToken": '{{ csrf_token }}'
      },
      data : { 'delete_id': del_id},

      success : function(json) {
        document.location.href = "{% url 'report_view' DB_report_query.pk %}";
        document.location.reload(true);
      }
  });
}
</script>


<script>
  function DeleteID_AT(del_id) {
        $.ajax({
            type: 'POST',
            url: "{% url 'attackflow_delete' %}",
            headers:{
              "X-CSRFToken": '{{ csrf_token }}'
            },
            data : { 'delete_id': del_id},

            success : function(json) {
              document.location.href = "{% url 'report_view' DB_report_query.pk %}"
            }
        })
  }
</script>


<script>
function CloneFinding(finding_id) {
  $.ajax({
      type: 'POST',
      url: "{% url 'finding_duplicate' %}",
      headers:{
        "X-CSRFToken": '{{ csrf_token }}'
      },
      data : { 'duplicate_id': finding_id},

      success : function(json) {
        document.location.href = "{% url 'report_view' DB_report_query.pk %}";
        document.location.reload(true);
      }
  });
}
</script>


{% endblock javascripts %}
